<template>
  <c-select
    v-bind="$attrs"
    v-on="$listeners"
    :value="value"
    :options="guaType"
    :numberKey="numberKey"
    :loading="loading"
    @change="hangleChange"
  ></c-select>
</template>

<script>
import { mapGetters } from 'vuex'
export default {
  components: {},
  props: {
    value: [String, Number],
  },
  model: {
    prop: 'value',
    event: 'change',
  },
  data() {
    return {
      params: {
        'agency_type.eq': 6,
        'access_status.gt': 0,
        'service_agency_lever.in': '1,2',
        fields: ['access_agency_id', 'service_agency_lever'],
      },
      tableName: 'credit_agency_access_view',
      guaType: [],
      loading: false,
    }
  },
  computed: {
    ...mapGetters(['clientId', 'user']),
    isCity() {
      return this.user.orgRegionLever === 2
    },
    numberKey() {
      return typeof this.value === 'number'
    },
  },
  watch: {},
  created() {
    this.params['access_agency_id.eq'] = this.clientId
    this.getData()
  },
  mounted() {},
  methods: {
    getData() {
      const { numberKey } = this
      this.loading = true
      this.guaType = [{ label: '直担业务', value: numberKey ? 2 : '2' }]
      this.$api
        .getData(this.$serviceName, this.tableName, this.params)
        .then(res => {
          const data = (res && res.data) || []
          const hasProvince = data.length > 0
          if (hasProvince) {
            this.guaType.push({
              label: '联担业务',
              value: numberKey ? 4 : '4',
            })
            // if (!this.value) {
            //   this.$emit('change', numberKey ? 4 : '4' || '')
            // }
          }
        })
        .finally(() => {
          this.loading = false
        })
    },
    hangleChange(val) {
      const select = this.guaType.find(item => +item.value === +val) || {}
      this.$emit('select', select)
    },
  },
}
</script>

<style lang="scss" scoped></style>
